@import './base.css';

body {
    margin: 0;
    padding: 0;
    color: var(--DFC);
    font-size: var(--DFS);
}

ul,li {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

a {
    color: var(--DFC);
    text-decoration: none;
}

#app {
    padding: 0;
    margin: 0;
}

.os-logo img {
    width: 60px;
}

.os-menu-but {
    top: 50%;
    z-index: 99;
    width: 50px;
    height: 150px;
    display: flex;
    cursor: pointer;
    position: absolute;
    align-items: center;
    mask-image: var(--MBG);
    justify-content: center;
    transform: translateY(-50%);
    border-radius: 0 50px 50px 0;
    background-color: var(--MEB);
    -webkit-mask-image: var(--MBG);
}

.collapse .os-menu-but {
    left: -1px;
    color: var(--MEC);
    animation: float-left 300ms;
}

.os-menu-but el-icon {
    width: 30px;
    height: 30px;
}

.os-menu-but:hover svg {
    animation: bounce-right 2s infinite;
}

.open .os-menu-but {
    right: -1px;
    opacity: 0.7;
    color: var(--MAC);
    animation: float-right 700ms;
    background-color: var(--MAB);
    transform: translateY(-50%) rotateY(180deg);
}

.os-main-header-search {
    max-width: 220px;
}

.os-main-header-search .el-input__wrapper {
    border-radius: 40px;
}

.el-menu-item.is-active {
    background: var(--MEAB);
}

.el-sub-menu.is-opened, .is-opened .el-menu {
    background: var(--MEAM);
}

.el-menu-item.hide {
    display: none;
}

.os-form-input {
    width: 100%;
}

.os-form-input.os-input-tooltip {
    width: calc(100% - 25px);
}

/*.os-rtl-drawer {*/
/*    max-width: 100%;*/
/*}*/

.mo {
    display: none;
}

@media (max-width: 991px) {
    .pc {
        display: none;
    }

    .mo {
        display: block;
    }

    .os-rtl-drawer {
        width: 100%!important;
    }
}


